import { useState } from "react";
import styles from "./index.module.scss";
import classnames from "classnames";

/* 
组件要接收什么数据 来实现自身的功能 
1 外部传入什么属性，原封不动全部都传递给 textarea
2 class 
 */

// 声明要接收的属性都类型
interface IProp extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
  className?: string;
  value?: string;
}
export default function Textarea({ className, value, ...props }: IProp) {
  return (
    <div className={styles.root}>
      {/* 文本输入框 */}
      <textarea
        {...props}
        value={value}
        className={classnames("textarea", className)}
      />
      {/* 当前字数/最大允许字数 */}
      <div className="count">
        {value?.length || 0}/{100}
      </div>
    </div>
  );
}
